<template>
	<view>
		<u-tabbar :value="props.value" :fixed="true" :placeholder="true" :safeAreaInsetBottom="true">
			<template v-for="(item, index) in props.list" :key="index">
				<u-tabbar-item v-if="item.type == 'default'" :text="item.text" :icon="item.icon"
					@click="toPage(item.path)"></u-tabbar-item>
				<u-tabbar-item :text="item.text" :badge="item.badge" @click="toPage(item.path)"
					v-if="item.type == 'solt'">
					<image :style="{width: '46rpx',height: '44rpx',}" slot="active-icon" :src="item.selected"></image>
					<image :style="{width: '46rpx',height: '44rpx',}" slot="inactive-icon" :src="item.unselected">
					</image>
				</u-tabbar-item>

				<u-tabbar-item :text="item.text" :dot="item.badge >0 ? true:false" @click="toPage(item.path)"
					v-if="item.type == 'zhong'">
					<image :style="{width: '80rpx',height: '80rpx',}" slot="active-icon" :src="item.selected"></image>
					<image :style="{width: '80rpx',height: '80rpx',}" slot="inactive-icon" :src="item.unselected">
					</image>
				</u-tabbar-item>
			</template>
		</u-tabbar>
	</view>
</template>
<script setup>
	import {
		// reactive,
		// ref,
		defineProps
	} from 'vue';

	// type typeValue = 'solt' | 'default'


	// interface listType {
	// 	select?: String,
	// 	unselected?: String,
	// 	text?: String,
	// 	icon?: String,
	// 	name?: String | Number,
	// 	badge: String | Number
	// 	dot: Boolean,

	// 	type: typeValue

	// }



	// interface Props {
	// 	list: Array<listType>,
	// 	type: typeValue
	// 	value:number
	// }


	const props = defineProps({
		list: {
			type: Array,
			default: () => []
		},
		slotStyle: {
			type: Object,
			default: () => {},

		},
		value: {
			type: Number,
			default: 0
		},
		isToPage: {
			type: Boolean,
			default: false
		}
	})

	const toPage = (url) => {

		if (props.isToPage) {
			uni.showToast({
				icon: "none",
				title: "请先完善酒店信息"
			})

			return
		}


		uni.redirectTo({
			url: url
		})
	}

	// const props = (, {
	// 	list: () => [],
	// 	slotStyle: ()=>{},
	// 	value:0
</script>

<style></style>